<template>
    <div style="background-color: white;text-align: center">
        <router-link to="login">
            <van-nav-bar fixed="true" left-text="返回" left-arrow></van-nav-bar>
        </router-link>
        <div style="margin-top: 46px">
        <span >选择用户头像</span>
        </div>
        <van-cell-group style="margin-top: 10px">
            <van-radio-group v-model="radio" direction="horizontal" style="justify-content: center">
                <van-radio name="../../static/images/nan.png" icon-size="24px"><img src="../../static/images/nan.png" width="50" height="50" style="border-radius: 50%"></van-radio>
                <van-radio name="../../static/images/nv.png" icon-size="24px"><img src="../../static/images/nv.png" width="50" height="50" style="border-radius: 50%"></van-radio>
            </van-radio-group>

            <van-field
                    style="margin-top: 10px"
                    v-model="username"
                    label="用户名"
                    placeholder="请输入用户名"

            />
            <van-field
                    v-model="usersex"
                    required
                    label="性别"
                    placeholder="请输入性别"
            />
            <van-field
                    v-model="userage"
                    required
                    label="年龄"
                    placeholder="请输入年龄"
            />
            <van-field
                    v-model="number"
                    required
                    label="账号"
                    placeholder="请输入账号"
            />
            <van-field
                    v-model="pwd"
                    required
                    label="密码"
                    placeholder="请输入密码"
            />
        </van-cell-group>
            <van-button @click="register" style="margin-top: 10px" size="small" color="linear-gradient(to right, #4bb0ff, #6149f6)" round type="info">确认注册
            </van-button>
    </div>
</template>

<script>
    export default {
        name: "register",
        data(){
            return{
                radio:'',
                username:'',
                usersex:'',
                userage:'',
                number:'',
                pwd:''
            }
        },
        methods:{
            register(){
                console.log(this.username)
                console.log(this.usersex)
                console.log(this.userage)
                console.log(this.number)
                console.log(this.pwd)
                console.log(this.radio)
                this.$axios.post('/user/insert',{
                    "lawUserName":this.username,
                    "lawUserSex":this.usersex,
                    "lawUserAge":this.userage,
                    "lawUserNumber":this.number,
                    "lawUserPwd":this.pwd,
                    "lawUserImage":this.radio,
                },
                res =>{
                    console.log(res)
                    if (!this.number){
                        this.$toast.fail('必须填写账号!')
                    }else if (!this.pwd){
                        this.$toast.fail('必须填写密码！')
                    }else if (!this.username){
                        this.$toast.fail('必须填写用户名！')
                    }else if (!this.usersex){
                        this.$toast.fail('必须填写性别！')
                    }else if (!this.userage){
                        this.$toast.fail('必须填写年龄！')
                    }else if (!this.radio){
                        this.$toast.fail('必须选择头像！')
                    } else if (res.data.success){
                        this.$router.push('/login')
                        this.$toast.success('注册成功，请登录！')
                    }else {
                        this.$toast(res.data.message)
                    }
                })
            }
        }

    }
</script>


<style scoped>

</style>
